﻿(function ($) {
    $.fn.checkbox = function (options) {

        var $settings = $.extend({
            'useInternalStyle': true,
            'chooseText': 'Wybierz',
            'cancelText': 'Anuluj'
        }, options);


        if ($settings['useInternalStyle']) {
            if (!$('head #checkbox-style').is('style')) {
                $('<style type="text/css" id="checkbox-style">' + checkboxStyle + '</style>').prependTo($('head'));
            }
        }

        return this.each(function () {
            var $this = $(this);
            var $label = $('label[for=' + $this.attr('id') + ']');
            var $el = $('<div class="bh-checkbox">\
    <div class="bh-checkbox-bntwrap">\
        <a class="check">'+ $settings['chooseText'] + '</a>\
        <a class="uncheck">' + $settings['cancelText'] + '</a>\
    </div>\
    <div class="bh-checkbox-label">' + $label.html() + '</div>\
    <div class="clear"></div>\
</div>\
');
            var initState = $this.is('input:checked') && $this.attr('checked');
            $el.addClass(initState ? 'bh-checkbox-checked' : 'bh-checkbox-unchecked');
            $this.hide();
            $label.hide();
            $this.after($el);

            $el.click(function (e) {
                var state = $this.is('input:checked') && $this.attr('checked');
                if (state) {
                    $this.attr('checked', false);
                    $el.removeClass('bh-checkbox-checked');
                    $el.addClass('bh-checkbox-unchecked');
                } else {
                    $this.attr('checked', true);
                    $el.addClass('bh-checkbox-checked');
                    $el.removeClass('bh-checkbox-unchecked');
                }
                $this.trigger('change');
            });
        });

    }
})(jQuery);

var checkboxStyle = ' \
 .bh-checkbox { \
    display: inline-block; \
    background-color: #eee; \
    color: #404040; \
    -webkit-border-radius: 10px; \
    border-radius: 10px; \
    font-size: 11px; \
    } \
    .bh-checkbox-bntwrap { \
        float: left; \
    } \
    .bh-checkbox-bntwrap { \
        margin-right: 10px; \
        padding: 10px; \
        border-right: solid 1px #610C00; \
    } \
    .bh-checkbox-bntwrap a { \
        -webkit-border-radius: 5px; \
        border-radius: 5px; \
        background-color: #91a123; \
        color: #fff; \
        font-weight: bold; \
        padding: 7px 10px; \
        display: block; \
    } \
    .bh-checkbox-label { \
        float: right; \
        padding: 10px; \
        text-align: center; \
    } \
    .bh-checkbox-unchecked .uncheck { \
        display: none; \
    } \
    .bh-checkbox-checked .check { \
        display: none; \
    } \
    .bh-checkbox-checked .uncheck { \
        background-color: transparent; \
        padding: 7px 0 7px 30px; \
    } \
    .bh-checkbox-checked { \
        background-color: #91A123; \
        background-image: url(\'/data/sites/1/skins/blackhouse/images/checkbox-checked.jpg\'); \
        background-repeat: no-repeat;\
        background-position: 7px 10px;\
    }\
';